<template>
  <!-- 通知弹窗 -->
  <el-popover placement="bottom"  trigger="click" @show="show=true" @hide="show=false">
    <div class="phoneWrapper">
      <el-row :gutter="10">
        <el-col :span="12">
          <div class="flex-column-center">
            <span>安卓app安装包</span>
            <img style="width: 200px;height: 200px;margin-top: 20px" src="@/assets/images/app-qcode.jpg" alt="">
          </div>
        </el-col>
        <el-col :span="12">
          <div class="flex-column-center">
            <span>微信小程序码</span>
            <img style="width: 200px;height: 200px;margin-top: 20px" src="@/assets/images/weixin-qcode.jpg" alt="">
          </div>
        </el-col>
      </el-row>
    </div>
    <div slot="reference">
      <div>
        <el-badge :value="magTotal" :max="99" :hidden="magTotal<1" class="item" title="公告">
          <svg-icon icon-class="phone" style="font-size: 24px;"/>
        </el-badge>
      </div>

    </div>
  </el-popover>
</template>

<script>
export default {
  name: 'MmvPhone',

  data() {
    return {};
  },
  mounted() {

  },
  methods: {}
}
</script>
<style lang="scss" scoped>
.flex-column-center {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 10px;
}

.el-badge__content.is-fixed {
  top: 15px !important;
}
</style>
